<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <link th:href="@{/erp/assets/css/bootstrap.min.css}" rel="stylesheet" />
        <link rel="stylesheet" th:href="@{/erp/css/style.css}"/>
        <link th:href="@{/erp/assets/css/codemirror.css}" rel="stylesheet">
        <link rel="stylesheet" th:href="@{/erp/assets/css/ace.min.css}" />
        <link rel="stylesheet" th:href="@{/erp/assets/css/font-awesome.min.css}" />
        <script th:src="@{/erp/assets/js/jquery.min.js}"></script>
		<script th:src="@{/erp/assets/js/bootstrap.min.js}"></script>
		<script th:src="@{/erp/assets/js/typeahead-bs2.min.js}"></script>
		<!-- page specific plugin scripts -->
		<script th:src="@{/erp/assets/js/jquery.dataTables.min.js}"></script>
		<script th:src="@{/erp/assets/js/jquery.dataTables.bootstrap.js}"></script>
        <script th:src="@{/erp/assets/layer/layer.js}" type="text/javascript" ></script>
        <script th:src="@{/erp/assets/laydate/laydate.js}" type="text/javascript"></script>
<title>员工管理</title>
</head>
<body>


<div class="page-content clearfix">
    <div id="Member_Ratings">
      <div class="d_Confirm_Order_style">
    <div class="search_style">
     <form id="shu" action="/staff/staff_list" method="post">
      <ul class="search_content clearfix">
	  	<li><label class="l_f">员工名称</label>
            <input name="staffName" type="text" id="staffName"  placeholder="输入员工名称"  style=" width:180px"/>
        </li>
       <li style="width:90px;"><button type="button" class="btn_search" id="likeSelect"><i class="icon-search"></i>查询</button></li>
      </ul>
     </form>
    </div>
     <!---->
     <div class="border clearfix">
       <span class="l_f">
        <a href="javascript:;"  class="property_add btn btn-warning"  id="member_add" ><i class="icon-plus"></i>员工账号分配</a>
		
       </span>
     </div>
     <!---->
     <div class="table_menu_list">
       <table class="table table-striped table-bordered table-hover" id="sample-table">
		<thead>
		 <tr>
				<th width="70px">序号</th>
				<th width="100px">员工编号</th>
				<th width="80px">员工姓名</a></th>
				<th width="120px">职位</th>
				<th width="130px">所属部门</th>
				<th width="150px">员工成绩</th>
				<th width="180px">入职时间</th>
				<th width="100px">员工状态</th>
				<th width="70px">账号状态</th>                
				<th width="150px">操作</th>
			</tr>
		</thead>
	</table>
   </div>
  </div>
 </div>
</div>
<script>

    /*区域分配-添加*/
    $('#member_add').on('click', function(){
        layer.open({
            type: 2,
            title: '员工账号分配',
            maxmin: true,
            shadeClose: true, //点击遮罩关闭层
            area : ['600px' , '600px'],
            content:'/human/staff/Brand_addPage',
            yes:function(index,layero){
                var num=0;
                var str="";
                $(".add_menber input[type$='text']").each(function(n){
                    if($(this).val()=="")
                    {
                        layer.alert(str+=""+$(this).attr("name")+"不能为空！\r\n",{
                            title: '提示框',
                            icon:0,
                        });
                        num++;
                        return false;
                    }
                });
                if(num>0){  return false;}
                else{
                    layer.alert('分配成功！',{
                        title: '提示框',
                        icon:1,
                    });
                    layer.close(index);
                }
            }
        });
    });
    var table1;
    jQuery(function($) {
         table1 = $('#sample-table').DataTable( {
            destroy:true,
            searching: false,
            bFilter: false, //是否启动过滤、搜索功能
            serverSide: true,     // true表示使用后台分页
            ajax: {
                "url": "/staff/staff_list",  // 异步传输的后端接口url
                "type": "POST",
                dataSrc: "data",
                data: function (d) {
                    var param = {};
                    param.draw = d.draw;
                    param.start = d.start;
                    param.length = d.length;
                    param.staffName = $('#staffName').val()
                    return param;//自定义需要传递的参数。
                },
            },
            'autoWidth': false,
            "columns": [
                {"data": "id"},
                {"data": "staffId"},
                {"data": "staffName"},
                {"data": "postName"},
                {"data": "deptName"},
                {"data": "staffScore"},
                {"data": "staffEntry"},
                {"data": "staffWork"},
                {"data": "numberId",
                    "createdCell": function (td, cellData, rowData, row, col) {
                        if (cellData == "1") {
                            var span = $('<span></span>').text("已启用").addClass("label label-success radius");
                            $(td).empty().addClass("td-status").append(span);
                        } else {
                            var span = $('<span></span>').text("已停用").addClass("label label-defaunt radius");
                            $(td).empty().addClass("td-status").append(span);
                        }
                    }
                },
                {"data": "numberId",
                    "createdCell": function (td, cellData, rowData, row, col) {
                        if (cellData == "1") {
                            $(td).empty().append('<td class="td-manage"> <a value="' + row + '"   href="javascript:;" title="停用"  class="btn btn-xs btn-success status" ><i class="icon-ok bigger-120"></i></a> ' +
                                '<a value="' + row + '" title="编辑" class="btn btn-xs btn-success  property_edit"><i class="icon-edit bigger-120"></i></a></td>');
                        }else {
                            $(td).empty().append('<td class="td-manage"> <a value="' + row + '"  style="text-decoration:none" class="btn btn-xs status" href="javascript:;" title="启用"><i class="icon-ok bigger-120"></i></a> ' +
                                '<a value="' + row + '" title="编辑" class="btn btn-xs btn-success  property_edit"><i class="icon-edit bigger-120"></i></a></td>');
                        }
                    }
                }
            ]
        } );
        $("#likeSelect").click(function(){
            console.log("reload");
            table1.ajax.reload();
        })

        //修改人员
        $('table').on('click', '.property_edit', function () {
            var index = $(this).attr('value');
            var datas = table1.row(index).data();
            layer.open({
                type: 2,
                title: '编辑员工',
                shadeClose: true,
                shade: false,
                maxmin: true, //开启最大化最小化按钮
                area: ['893px', '600px'],
                content: '/staff/staffUpd?data='+datas.id
            });
        })


        $('table').on('click', '.status', function () {
            var index = $(this).attr('value');
            var datas = table1.row(index).data();

            if (datas.numberId == "1") {
                layer.confirm('确定禁用？', {
                    btn: ['确定', '取消'] //按钮
                }, function () {
                    $.post('/staff/isStart', datas, function (res) {
                        if (res.rs) {
                            layer.msg('已停用!',{icon: 5,time:1000});
                            var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                            $('#likeSelect', window.document).click();
                        } else {
                            layer.msg(res.msg, {icon: 2});
                        }
                    })
                })
            }else{
                layer.confirm('确定启用？', {
                    btn: ['确定', '取消'] //按钮
                }, function () {
                    $.post('/staff/isStart', datas, function (res) {
                        if (res.rs) {
                            layer.msg('已启用!',{icon: 6,time:1000});
                            var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                            $('#likeSelect', window.document).click();
                        } else {
                            layer.msg(res.msg, {icon: 2});
                        }
                    })
                })
            }


        })

    })
</script>
</body>
</html>
